<extend name="public@:user_basics"/>
<block name="body">
    <div class="row-content am-cf" id="app" v-block="">
        <div class="row am-cf">
            <div class="row am-cf">
                <div class="am-u-sm-12 am-u-md-12">
                    <div class="widget am-cf" style="margin-bottom: 0;">
                        <div class="widget-head am-cf">
                            <form action="{:cmf_url('user/goods/index')}" method="get" @submit.prevent="getData" class="am-form tpl-form-line-form" id="form" method="get">
                                <div class="am-form-group am-u-sm-12 am-u-md-8">
                                    <label for="user-name" class="am-form-label" style="float: left;">商品分类 </label>
                                    <div class="am-u-sm-9 am-u-md-3">
                                        <select name="goods_type">
                                            <option value="">全部</option>
                                            <volist name="goods_type" id="vo">
                                                <option value="{$vo.id}">{$vo.name}</option>
                                            </volist>
                                        </select>
                                    </div>
                                    <label for="user-name" class="am-form-label" style="float: left;">商品名称 </label>
                                    <div class="am-u-sm-9 am-u-md-3">
                                        <input type="text" name="goods_keyword" class="tpl-form-input" id="user-name">
                                    </div>
                                    <button class="chanpss chanpss1" style="float: left;"><i class="am-icon-search"></i></button>
                                </div>
                            </form>
                        </div>

                        <div class="widget-body  widget-body-lg am-fr bgnr">

                            <table width="100%" class="am-table am-table-compact tpl-table-black ">
                                <thead>
                                    <tr>
                                        <th>编号</th>
                                        <th>商品名称</th>
                                        <th>最低价</th>
                                        <th>添加价</th>
                                        <th>出售价</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                <tr class="gradeX" v-for="(vo,index) in dataList">
                                    <td>{{vo.g_id}}</td>
                                    <td>{{vo.g_name}}</td>
                                    <td>{{vo.basics_money}}</td>
                                    <td><input type="text" v-model="vo.money" @change="setMoney(vo)"></td>
                                    <td>{{parseFloat(vo.basics_money) + parseFloat(vo.money)}}</td>
                                    <td>
                                        <div class="tpl-table-black-operation">
                                            <a href="javascript:;" class="spflan" v-if="vo.shop_goods_state" @click="setGoodsType(index,0)">
                                                <i class="am-icon-reorder (alias)"></i><span class="shangjia">下架</span>
                                            </a>
                                            <a href="javascript:;" class="spflan" style="opacity: .5" v-else @click="setGoodsType(index,1)">
                                                <i class="am-icon-reorder (alias)"></i><span class="shangjia">上架</span>
                                            </a>

                                        </div>
                                    </td>
                                </tr>
                                <!-- more data -->
                                </tbody>
                            </table>

                        </div>
                        <div class="phonenr"  v-for="(vo,index) in dataList">
                            <p class="phonenr1">编号:{{vo.id}}</p>
                            <p class="phonenr1">商品名称:{{vo.g_name}}</p>
                            <p class="phonenr1">最低价:{vo.basics_money{}}</p>
                            <p class="phonenr1">添加价:<input type="text" v-model="vo.money" @change="setMoney(vo)"></p>
                            <p class="phonenr1">出售价:{{parseFloat(vo.basics_money) + parseFloat(vo.money)}}</p>
                            <div class="tpl-table-black-operation">
                                <div class="tpl-table-black-operation">
                                    <a href="javascript:;" class="spflan" v-if="vo.shop_goods_state" @click="setGoodsType(index,0)">
                                        <i class="am-icon-reorder (alias)"></i><span class="shangjia">下架</span>
                                    </a>
                                    <a href="javascript:;" class="spflan" style="opacity: .5" v-else @click="setGoodsType(index,1)">
                                        <i class="am-icon-reorder (alias)"></i><span class="shangjia">上架</span>
                                    </a>

                                </div>
                            </div>
                        </div>
                        <div class="widget-body-md widget-body tpl-amendment-echarts am-fr" id="tpl-echarts" style="display: none;">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <link rel="stylesheet" href="__STATIC__/js/page/simplePaging.css">
    <script src="__STATIC__/js/page/simplePaging.js"></script>
    <script>
        $(function () {
            var app = new Vue({
                el:'#app'
                ,data:function () {
                    return {
                        dataList:[]
                        ,state:0
                    }
                }
                ,mounted:function(){
                    this.getData();
                }
                ,methods:{
                    getData:function (e) {
                        this.state = 0;
                        this.dataList=[];
                        $.post('{:cmf_url("user/goods/index")}',$('#form').serialize(),function (da) {
                            app.dataList = da.data;
                            app.state = 1;
                        })
                    }
                    //设计价格
                    ,setMoney:function (row) {
                        $.post('{:cmf_url("setMoney")}',{money:row.money,goods_id:row.g_id},function (da) {
                            if(da.code != 1){
                                sweetAlert(da.msg,'编辑金额提示','error')
                            }else{
                                sweetAlert(da.msg,'编辑金额提示','success')
                            }
                        })
                    }
                    //上下架
                    ,setGoodsType:function (index,type) {
                        var this_data = app.dataList[index];
                        $.post('{:cmf_url("setGoodsType")}',{goods_type:type,goods_id:this_data.g_id},function (da) {
                            if(da.code != 1){
                                sweetAlert(da.msg,'编辑金额提示','error')
                            }else{
                                app.dataList[index].shop_goods_state = type;
                                sweetAlert(da.msg,'编辑金额提示','success')
                            }
                        })
                    }
                }
            });

        })
    </script>
</block>